<div class="x-color-box">
  <div class="x-color-primary" [style.background-color]="hex" [class.x-color-only]="colors.length === 0">
    <span>{{ label }}</span>
    <span class="x-color-hex">{{ hex }}</span>
  </div>
  <div class="x-color-gradual">
    <div class="x-color-item" *ngFor="let color of colors; index as i; trackBy: trackByColor" [style.background-color]="color"></div>
  </div>
</div>
